<!--
 @description 生产主页
 @fileName index.vue
 @author zengqiongying
 @created 2021/05/28 13:29:30
-->
<template>
  <div>
    <div class="top-container">
      <div class="banner">
        <img src="@/assets/image/banner-produces.png">
      </div>
      <div class="main-page">
        <span class="icon-tip left" />
        <span class="icon-tip right" />
        <div class="wrapper">
          <div class="main-title">
            <div style="flex:1">核心指标</div>
            <div class="core-time" @click="showCalendar=true">
              <span>{{ coreDateShow }}</span>
              <svg-icon icon-class="xia" />
            </div>
          </div>
          <core-data :core-date="coreDate" @set-factory="handleSetFactory" />
        </div>
      </div>
    </div>
    <div id="tabFixed" class="tab-titles" :class="{'is_fixed':isFixed}">
      <div class="tab-box" :class="{'has-sub':tabName!=='order'}">
        <template v-for="(item,index) in pageTabs">
          <div :key="index" class="tab " :class="{'active':tabName===item.name}" @click="tabName=item.name"><span>{{ item.name }}</span></div>
        </template>
      </div>
    </div>
    <div class="tab-page-content">
      <tab-page v-if="tabName" :core-date="coreDate" :select-type="tabName" />
    </div>
    <van-calendar
      v-model="showCalendar"
      class="custom-calendar"
      color="#12B9A3"
      :row-height="40"
      :min-date="calendarMinDate"
      :max-date="calendarMaxDate"
      @confirm="onConfirmCalendar"
    />
  </div>
</template>

<script>
import CoreDateMixin from '@/mixins/CoreDate'
import ScrollTab from '@/mixins/ScrollTab'
import CoreData from './components/CoreData'
import TabPage from '@/components/produces/TabPage'
export default {
  name: 'ProducesIndex',
  components: { CoreData, TabPage },
  mixins: [CoreDateMixin, ScrollTab],
  data() {
    return {
      pageTabs: [
        /* { name: '板式' },
        { name: '实木' },
        { name: '沙发' },
        { name: '床垫' },
        { name: '定制' } */
      ],
      tabName: ''// '板式'
    }
  },
  computed: {

  },
  created() {

  },
  methods: {
    handleSetFactory(list) {
      this.pageTabs = []
      if (list && list.length) {
        list.forEach(v => {
          if (v.factoryTypeName) {
            this.pageTabs.push({
              name: v.factoryTypeName
            })
          }
        })
      }

      this.tabName = this.pageTabs.length > 0 ? this.pageTabs[0].name : ''
    }
  }
}

</script>
<style lang='less' scoped>
/deep/ .main-page{
  padding-top: 10px;
}
</style>
